<template>
  <!-- 查询项目申报(主表 + 子表) 弹窗 -->
  <vxe-modal :loading="loading" min :close-on-click-modal="false"
             :key="dialogKey" v-model="ziVisible" title="查看项目申报" width="70%" esc-closable showFooter show-zoom resize>
    <div style="height: 77vh; overflow-y: auto;">
      <el-card class="box-card" shadow="never" :body-style="{ padding: '10px',backgroundColor: '#bfcdda' }">

        <!-- 点击课题名称 项目基本资料 -->
        <el-card class="box-card" shadow="hover">
          <div slot="header" class="clearfix">
            <span style="font-size: 16px; color: #1890ff;">项目基本资料</span>
          </div>
          <el-descriptions class="margin-top" :column="2" size="medium" border
                           :contentStyle="content_style" :labelStyle="label_style">
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-user"></i>
                  课题名称：
                </div>
              </template>
              {{ dialogTableData.ktName }}
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-mobile-phone"></i>
                  课题编号：
                </div>
              </template>
              {{ dialogTableData.ktBh }}
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-tickets"></i>
                  申请单位：
                </div>
              </template>
              <el-tag size="small">{{ dialogTableData.zrBm }}</el-tag>
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  课题分类：
                </div>
              </template>
              <dict-tag :options="dict.type.kylx_ktfl" :value="dialogTableData.ktFl"/>
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  起止年月：
                </div>
              </template>
              {{ dialogTableData.qTime + ' 至 ' + dialogTableData.zTime }}
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  依托工程：
                </div>
              </template>
              {{ dialogTableData.ytGc }}
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  申报日期：
                </div>
              </template>
              {{ dialogTableData.sbRq }}
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  录入人员：
                </div>
              </template>
              {{ dialogTableData.lrRy }}
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  课题归属：
                </div>
              </template>
              <dict-tag :options="dict.type.kylx_ktgs" :value="dialogTableData.ktGs"/>
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  所属领域：
                </div>
              </template>
              <dict-tag :options="dict.type.kylx_ssly" :value="dialogTableData.ssLy"/>
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  高企服务：
                </div>
              </template>
              <dict-tag :options="dict.type.kylx_gqfw" :value="dialogTableData.gqFw"/>
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  研发项目级别：
                </div>
              </template>
              <dict-tag :options="dict.type.kylx_yfxmjb" :value="dialogTableData.xmYfJb"/>
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  合作方式：
                </div>
              </template>
              <dict-tag :options="dict.type.kylx_hzfs" :value="dialogTableData.hzFs"/>
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  国家：
                </div>
              </template>
              <dict-tag :options="dict.type.kylx_country" :value="dialogTableData.gj"/>
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  币种：
                </div>
              </template>
              <dict-tag :options="dict.type.kylx_bz" :value="dialogTableData.bz"/>
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  项目分类（财务系统）：
                </div>
              </template>
              <dict-tag :options="dict.type.kylx_xmfl_cwxt" :value="dialogTableData.xmFlCwxt"/>
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  所属领域（财务系统）：
                </div>
              </template>
              <dict-tag :options="dict.type.kylx_ssly_cwxt" :value="dialogTableData.ssLyCwxt"/>
            </el-descriptions-item>

          </el-descriptions>
        </el-card>
        <br>

        <!-- 点击课题名称 项目负责人情况 -->
        <el-card class="box-card" shadow="hover">
          <div slot="header" class="clearfix">
            <span style="font-size: 16px; color: #1890ff;">项目负责人情况</span>
          </div>
          <el-descriptions class="margin-top" :column="3" size="medium" border
                           :contentStyle="content_style" :labelStyle="label_style">
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  姓名：
                </div>
              </template>
              {{ dialogTableData.fzName }}
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  性别：
                </div>
              </template>
              <dict-tag :options="dict.type.sys_user_sex" :value="dialogTableData.fzXb"/>
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  年龄：
                </div>
              </template>
              {{ dialogTableData.fzNl }}
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  专业：
                </div>
              </template>
              {{ dialogTableData.fzZy }}
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  联系电话：
                </div>
              </template>
              {{ dialogTableData.fzPhone }}
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  职称：
                </div>
              </template>
              <dict-tag :options="dict.type.rcpt_zc" :value="dialogTableData.fzZc"/>
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  邮政编码：
                </div>
              </template>
              {{ dialogTableData.fzYzbm }}
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  通讯地址：
                </div>
              </template>
              {{ dialogTableData.txdz }}
            </el-descriptions-item>

          </el-descriptions>
        </el-card>
        <br>

        <!-- 点击课题名称 项目组成员人数 -->
        <el-card class="box-card" shadow="hover">
          <div slot="header" class="clearfix">
            <span style="font-size: 16px; color: #1890ff;">项目组成员人数</span>
          </div>
          <el-descriptions class="margin-top" :column="3" size="medium" border
                           :contentStyle="content_style" :labelStyle="label_style">
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  总人数：
                </div>
              </template>
              {{ dialogTableData.zrs }}
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  高级人数：
                </div>
              </template>
              {{ dialogTableData.gjrs }}
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  中级人数：
                </div>
              </template>
              {{ dialogTableData.zjrs }}
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  研究生人数：
                </div>
              </template>
              {{ dialogTableData.yjsrs }}
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  初级人数：
                </div>
              </template>
              {{ dialogTableData.cjrs }}
            </el-descriptions-item>

          </el-descriptions>
        </el-card>
        <br>

        <!-- 点击课题名称 课题经费 -->
        <el-card class="box-card" shadow="hover">
          <div slot="header" class="clearfix">
            <span style="font-size: 16px; color: #1890ff;">课题经费</span>
          </div>
          <el-descriptions class="margin-top" :column="3" size="medium" border
                           :contentStyle="content_style" :labelStyle="label_style">
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  项目总额(万)：
                </div>
              </template>
              {{ dialogTableData.xmze }}
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  申请资助：
                </div>
              </template>
              {{ dialogTableData.sqzz }}
            </el-descriptions-item>
            <el-descriptions-item>
              <template slot="label">
                <div class="right-align-label">
                  <i class="el-icon-office-building"></i>
                  自筹金额：
                </div>
              </template>
              {{ dialogTableData.zcje }}
            </el-descriptions-item>


          </el-descriptions>
        </el-card>
        <br>

        <!-- 点击课题名称 申请单位意见 -->
        <el-card class="box-card" shadow="hover" style="min-height: 20vh">

          <div slot="header" class="clearfix">
            <span style="font-size: 16px; color: #1890ff;">申请单位意见</span>
          </div>
          <div style="font-size: 16px">
            {{ dialogTableData.sqDwYj }}
          </div>
        </el-card>
        <br>

        <!-- 点击课题名称 技术中心意见 -->
        <el-card class="box-card" shadow="hover" style="min-height: 20vh">

          <div slot="header" class="clearfix">
            <span style="font-size: 16px; color: #1890ff;">技术中心意见</span>
          </div>
          <div style="font-size: 16px">
            {{ dialogTableData.csYj }}
          </div>
        </el-card>
        <br>

        <!-- 点击课题名称 一、项目概述 -->
        <el-card class="box-card" shadow="hover" style="min-height: 25vh">

          <div slot="header" class="clearfix">
            <span style="font-size: 16px; color: #1890ff;">一、项目概述</span>
          </div>
          <span style="font-size: 16px; color: #000000; font-weight: 600">1、目的和意义:</span>
          <div class="ql-container ql-snow" style="border: 1px solid #ffffff;">
            <div class="ql-editor" style="font-size: 16px">
              <div v-html="dialogTableData.mdAndYy"></div>
            </div>
          </div>

          <span style="font-size: 16px; color: #000000; font-weight: 600">2、国内外概况及发展趋势:</span>
          <div class="ql-container ql-snow" style="border: 1px solid #ffffff;">
            <div class="ql-editor" style="font-size: 16px">
              <div v-html="dialogTableData.gnwgkAndFzqs"></div>
            </div>
          </div>
        </el-card>
        <br>

        <!-- 点击课题名称 二、项目主要研究开发内容、技术关键、创新性 -->
        <el-card class="box-card" shadow="hover" style="min-height: 25vh">

          <div slot="header" class="clearfix">
            <span style="font-size: 16px; color: #1890ff;">二、项目主要研究开发内容、技术关键、创新性</span>
          </div>
          <span style="font-size: 16px; color: #000000; font-weight: 600">1、主要研究开发内容:</span>
          <div class="ql-container ql-snow" style="border: 1px solid #ffffff;">
            <div class="ql-editor" style="font-size: 16px">
              <div v-html="dialogTableData.zyjjKfnr"></div>
            </div>
          </div>

          <span style="font-size: 16px; color: #000000; font-weight: 600">2、关键技术:</span>
          <div class="ql-container ql-snow" style="border: 1px solid #ffffff;">
            <div class="ql-editor" style="font-size: 16px">
              <div v-html="dialogTableData.gjJs"></div>
            </div>
          </div>

          <span style="font-size: 16px; color: #000000; font-weight: 600">3、创新性:</span>
          <div class="ql-container ql-snow" style="border: 1px solid #ffffff;">
            <div class="ql-editor" style="font-size: 16px">
              <div v-html="dialogTableData.cxx"></div>
            </div>
          </div>
        </el-card>
        <br>

        <!-- 点击课题名称 三、技术性能指标和预期成果形式 -->
        <el-card class="box-card" shadow="hover" style="min-height: 25vh">

          <div slot="header" class="clearfix">
            <span style="font-size: 16px; color: #1890ff;">三、技术性能指标和预期成果形式</span>
          </div>
          <span style="font-size: 16px; color: #000000; font-weight: 600">1、预期达到的技术经济指标:</span>
          <div class="ql-container ql-snow" style="border: 1px solid #ffffff;">
            <div class="ql-editor" style="font-size: 16px">
              <div v-html="dialogTableData.yqddJsjjzb"></div>
            </div>
          </div>

          <span style="font-size: 16px; color: #000000; font-weight: 600">2、预期成果和提供的形式:</span>
          <div class="ql-container ql-snow" style="border: 1px solid #ffffff;">
            <div class="ql-editor" style="font-size: 16px">
              <div v-html="dialogTableData.yqcgAndTgdxs"></div>
            </div>
          </div>

        </el-card>
        <br>

        <!-- 点击课题名称 四、项目计划进度和目标 -->
        <el-card class="box-card" shadow="hover" style="min-height: 25vh">

          <div slot="header" class="clearfix">
            <span style="font-size: 16px; color: #1890ff;">四、项目计划进度和目标</span>
          </div>
          <el-table :header-cell-style="{background:'#d0cece',color:'#000000',fontWeight:'bold'}"
                    :data="ziJhjdTableData">
            <el-table-column label="序号" align="center" type="index" width="50"/>
            <el-table-column label="开始日期" align="center" prop="ksRq" width="150"/>
            <el-table-column label="结束日期" align="center" prop="jsRq" width="150"/>
            <el-table-column label="研发内容" align="center" prop="yfNr" show-overflow-tooltip/>
            <el-table-column label="阶段目标" align="center" prop="jdMb" show-overflow-tooltip/>
            <!-- 其他列配置 -->
          </el-table>
        </el-card>
        <br>

        <!-- 点击课题名称 课题负责人(课题负责人的情况介绍) -->
        <el-card class="box-card" shadow="hover" style="min-height: 17vh">

          <div slot="header" class="clearfix">
            <span style="font-size: 16px; color: #1890ff;">课题负责人(课题负责人的情况介绍)</span>
          </div>
          <div class="ql-container ql-snow" style="border: 1px solid #ffffff;">
            <div class="ql-editor" style="font-size: 16px">
              <div v-html="dialogTableData.ktfzrQkjs"></div>
            </div>
          </div>

        </el-card>
        <br>

        <!-- 点击课题名称 五、课题承担单位的条件 -->
        <el-card class="box-card" shadow="hover" style="min-height: 25vh">

          <div slot="header" class="clearfix">
            <span style="font-size: 16px; color: #1890ff;">五、课题承担单位的条件</span>
          </div>
          <el-table :header-cell-style="{background:'#d0cece',color:'#000000',fontWeight:'bold'}"
                    :data="ziZcryTableData">
            <el-table-column label="序号" align="center" type="index" width="50"/>
            <el-table-column label="姓名" align="center" prop="name" width="80"/>
            <el-table-column label="年龄" align="center" prop="age" width="60"/>
            <el-table-column label="职务" align="center" prop="zhiWu" show-overflow-tooltip/>
            <el-table-column label="职称" align="center" prop="zhiChen" show-overflow-tooltip/>
            <el-table-column label="专业" align="center" prop="zy" show-overflow-tooltip/>
            <el-table-column label="本课题中分工" align="center" prop="bKtFg" show-overflow-tooltip/>
            <el-table-column label="投入课题工作总月数" align="center" prop="trZys" show-overflow-tooltip/>
            <el-table-column label="工作单位" align="center" prop="gzDw" show-overflow-tooltip/>
            <!-- 其他列配置 -->
          </el-table>
        </el-card>
        <br>

        <!-- 点击课题名称 六、项目的经费预算 -->
        <el-card class="box-card" shadow="hover" style="min-height: 25vh">

          <div slot="header" class="clearfix">
            <span style="font-size: 16px; color: #1890ff;">六、项目的经费预算</span>
          </div>
          <!-- 项目的经费预算上 -->
          <el-table :header-cell-style="{background:'#d0cece',color:'#000000',fontWeight:'bold'}"
                    :data="ziYffyTableData">
            <el-table-column label="序号" align="center" type="index" width="50"/>
            <el-table-column label="年份" align="center" prop="yffyYear" width="150"/>
            <el-table-column label="申请资助(万元)" align="center" prop="sqzz" width="150"/>
            <el-table-column label="自筹金额(万元)" align="center" prop="zcje" width="150"/>
            <el-table-column label="备注" align="center" prop="remark"/>
            <!-- 其他列配置 -->
          </el-table>
          <br>

          <!-- 项目的经费预算下 -->
          <div style="overflow-y: auto;">
            <el-table height="100vh" :header-cell-style="{background:'#d0cece',color:'#000000',fontWeight:'bold'}"
                      :data="ziYffysTableData">
              <el-table-column label="序号" align="center" type="index" width="50"/>
              <el-table-column label-class-name="custom-header" label="项目" align="left" prop="xm"/>
              <el-table-column label="项目总预算(万元)" align="center" prop="xmZys" width="130"/>
              <el-table-column label="第一年度预算" align="center" prop="oneYs" width="100"/>
              <el-table-column label="第二年度预算" align="center" prop="towYs" width="100"/>
              <el-table-column label="第三年度预算" align="center" prop="threeYs" width="100"/>
              <el-table-column label="第四年度预算" align="center" prop="fourYs" width="100"/>
              <el-table-column label="第五年度预算" align="center" prop="fiveYs" width="100"/>
              <!-- 其他列配置 -->
            </el-table>
          </div>
        </el-card>
        <br>

        <!-- 点击课题名称 7、附表 -->
        <el-card class="box-card" shadow="hover">

          <div slot="header" class="clearfix">
            <span style="font-size: 16px; color: #1890ff;">7、附表</span>
          </div>

          <!-- 直接用于研发的主要材料 -->
          <el-card class="box-card" shadow="hover" style="min-height: 25vh">
            <div slot="header" class="clearfix">
              <span style="font-size: 16px; color: #1890ff;">直接用于研发的主要材料</span>
            </div>
            <el-table :header-cell-style="{background:'#d0cece',color:'#000000',fontWeight:'bold'}"
                      :data="ziYfclTableData">
              <el-table-column label="序号" align="center" type="index" width="50"/>
              <el-table-column label="名称" align="center" prop="clName"/>
              <el-table-column label="单位" align="center" prop="clUnit"/>
              <el-table-column label="预计用量" align="center" prop="clDosage"/>
              <el-table-column label="备注" align="center" prop="clRemarks"/>
              <!-- 其他列配置 -->
            </el-table>
          </el-card>
          <br>

          <!-- 用于研发主要仪器、设备清单 -->
          <el-card class="box-card" shadow="hover" style="min-height: 25vh">
            <div slot="header" class="clearfix">
              <span style="font-size: 16px; color: #1890ff;">用于研发主要仪器、设备清单</span>
            </div>
            <el-table :header-cell-style="{background:'#d0cece',color:'#000000',fontWeight:'bold'}"
                      :data="ziYfsbTableData">
              <el-table-column label="序号" align="center" type="index" width="50"/>
              <el-table-column label="名称" align="center" prop="sbName"/>
              <el-table-column label="型号" align="center" prop="sbModel"/>
              <el-table-column label="价格(万元)" align="center" prop="sbPrice"/>
              <el-table-column label="备注" align="center" prop="sbRemarks"/>
              <!-- 其他列配置 -->
            </el-table>
          </el-card>
          <br>

          <!-- 中间试验费 -->
          <el-card class="box-card" shadow="hover" style="min-height: 25vh">
            <div slot="header" class="clearfix">
              <span style="font-size: 16px; color: #1890ff;">中间试验费</span>
            </div>
            <el-table :header-cell-style="{background:'#d0cece',color:'#000000',fontWeight:'bold'}"
                      :data="ziZjsyfTableData">
              <el-table-column label="序号" align="center" type="index" width="50"/>
              <el-table-column label="试验(检测)项目" align="center" prop="testingItems"/>
              <el-table-column label="价格(万元)" align="center" prop="price"/>
              <el-table-column label="备注" align="center" prop="remarks"/>
              <!-- 其他列配置 -->
            </el-table>
          </el-card>

        </el-card>
        <br>

        <!-- 点击课题名称 附件 -->
        <el-card class="box-card" shadow="hover" style="min-height: 25vh">
          <div slot="header" class="clearfix">
            <span style="font-size: 16px; color: #1890ff;">附件</span>
          </div>
          <el-table border :data="ziTableData">
            <!-- 弹窗中 el-table 的列配置 -->
            <el-table-column label="序号" align="center" type="index" width="50"/>
            <el-table-column label="文件类型" align="center" prop="fileType" width="160">
              <template slot-scope="scope">
                <dict-tag :options="dict.type.kylx_fjlx" :value="scope.row.fileType"/>
              </template>
            </el-table-column>
            <el-table-column label="文件名称" align="center" prop="fileName" :formatter="getFileNames"/>
            <el-table-column label="文件大小" align="center" prop="fileSize" width="150"/>
            <el-table-column label="操作" width="120" align="center" class-name="small-padding fixed-width">
              <template slot-scope="scope">
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-edit"
                  @click="handleDownload(scope.row)"
                >下载
                </el-button>

              </template>
            </el-table-column>
            <!-- 其他列配置 -->
          </el-table>
        </el-card>
        <br>
      </el-card>
    </div>
    <div slot="footer" class="dialog-footer" style="display: flex; justify-content: center;">
      <el-button icon="vxe-icon-file-word" size="mini" @click="handleExports">导 出</el-button>
      <el-button icon="el-icon-close" size="mini" @click="cancel">关 闭</el-button>
    </div>
  </vxe-modal>
</template>

<script>
import {
  exportXmsbWord,
  getXmsb,
  selectLlglXmsbByjhjdByXmsbId,
  selectLlglXmsbByYfclByXmsbId,
  selectLlglXmsbByyffyByXmsbId,
  selectLlglXmsbByyffysByXmsbId,
  selectLlglXmsbYfsbByXmsbId,
  selectLlglXmsbZcryByXmsbId,
  selectLlglXmsbZjsyfByXmsbId
} from "@/api/xmgl/lxgl/xmsb/xmsb";

export default {
  name: "xmxq",
  dicts: ['kylx_fjlx', 'year', 'kylx_ssly_cwxt', 'kylx_gqfw', 'kylx_country', 'sys_user_sex', 'kylx_xmfl_cwxt', 'kylx_ssly', 'kylx_hzfs', 'rcpt_zc', 'kylx_yfxmjb', 'kylx_ktgs', 'kylx_ktfl', 'kylx_bz'],
  data() {
    return {
      loading: false,
      dialogKey: 0,
      ziTableData: [], //子表信息
      ziVisible: false, // 控制子表弹窗显示/隐藏
      content_style: {
        // 解决不对齐的问题
        'width': "400px",
        // 排列第二行
        'word-break': 'break-all'
      },
      label_style: {
        // 解决不对齐的问题
        'width': "250px",
        // 排列第二行
        'word-break': 'break-all'
      },
      dialogTableData: [], // 弹窗中表格数据
      //详情页中间试验费
      ziZjsyfTableData: [],
      //详情页用于研发主要仪器、设备清单
      ziYfsbTableData: [],
      //详情页直接用于研发的主要材料
      ziYfclTableData: [],
      //详情页项目的经费预算下
      ziYffysTableData: [],
      //详情页项目的经费预算上
      ziYffyTableData: [],
      //详情页计划进度表格
      ziJhjdTableData: [],
      //详情页课题组成人员表格
      ziZcryTableData: [],
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        ktGs: null,
        year: null,
        ktName: null,
        deptId: null,
        userId: null,
      },
    }
  },
  methods: {
    //导出word按钮操作
    handleExports() {
      const queryParams = this.queryParams;
      const xmsbId = this.rowData.xmsbId; // Assuming lldId is defined somewhere in your component
      this.$confirm('是否确认导出word文档?', "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        this.loading = true
        return exportXmsbWord(queryParams, xmsbId); // Passing lldId to the exportWord function
      }).then(response => {
        this.$download.resource('/profile/upload/' + response.msg);
        this.loading = false
      }).catch(() => {
      });
    },
    cancel() {
      this.ziVisible = false;
    },
    // 去除文件名路径前缀
    getFileNames(row) {
      // 从路径中提取文件名
      return row.fileName.split('/').pop(); // 返回文件名部分
    },
    // 文件下载处理
    handleDownload(row) {
      const resource = row.fileName;
      // 默认方法
      this.$download.resource(resource);
    },
    handleOpen(row) {
      this.loading = true
      this.dialogKey++
      this.ziVisible = true;
      this.rowData = row;
      this.getXmXqData();
      setTimeout(() => {
        this.loading = false
      }, 1000)
    },
    getXmXqData() {
      const xmsbId = this.rowData.xmsbId;
      //查询项目申报详细
      getXmsb(xmsbId).then(res => {
        //将项目申报子表信息赋值到ziTableData
        this.dialogTableData = res.data
        this.ziTableData = res.data.lxglXmsbFjList;
      })
      //查询项目计划进度和目标
      selectLlglXmsbByjhjdByXmsbId(xmsbId).then(res => {
        //将项目计划进度和目标子表信息赋值到ziJhjdTableData
        this.ziJhjdTableData = res.data.lxglXmsbJhjdList;
      })
      //查询课题承担单位的条件(课题组成人员)
      selectLlglXmsbZcryByXmsbId(xmsbId).then(res => {
        //将项目计划进度和目标子表信息赋值到ziZcryTableData
        this.ziZcryTableData = res.data.lxglXmsbZcryList;
        console.log(this.ziZcryTableData, 'dasadsadsadsadsads')
      })
      //查询项目的经费预算 上
      selectLlglXmsbByyffyByXmsbId(xmsbId).then(res => {
        //将项目的经费预算上子表信息赋值到ziYffyTableData
        this.ziYffyTableData = res.data.lxglXmsbYffyList;
      })
      //查询项目的经费预算 下
      selectLlglXmsbByyffysByXmsbId(xmsbId).then(res => {
        //将项目的经费预算下子表信息赋值到ziYffysTableData
        this.ziYffysTableData = res.data.lxglXmsbYffyysList;
      })
      //查询直接用于研发的主要材料
      selectLlglXmsbByYfclByXmsbId(xmsbId).then(res => {
        //将直接用于研发的主要材料子表信息赋值到ziYfclTableData
        this.ziYfclTableData = res.data.lxglXmsbYfclList
      })
      //查询用于研发主要仪器、设备清单
      selectLlglXmsbYfsbByXmsbId(xmsbId).then(res => {
        //将用于研发主要仪器、设备清单子表信息赋值到ziYfsbTableData
        this.ziYfsbTableData = res.data.lxglXmsbYfsbList
      })
      //查询中间试验费
      selectLlglXmsbZjsyfByXmsbId(xmsbId).then(res => {
        //将中间试验费子表信息赋值到ziZjsyfTableData
        this.ziZjsyfTableData = res.data.lxglXmsbZjsyfList
      })
    }
  },
}
</script>

<style scoped>
.right-align-label {
  text-align: right;
}

/* 定义表头中特定类名的文本居中 */
.el-table .custom-header .cell {
  text-align: center !important;
}
/* header 头部背景 */
/deep/ .el-card__header {
  padding: 3px 7px 3px;
  min-height: 10px;
  background-color: aliceblue;
}
</style>
